<template>
  <div class="ybl x">
    <div class="y zbl zb hf">
      <div class="y p10px">
        <div class="x mt10px jc">
          <span v-text="'起始时间'" class="w105px" />
          <el-date-picker v-model="data.time[0]" align="right" type="date" placeholder="选择起始日期" />
        </div>
        <div class="x mt10px jc">
          <span v-text="'终止时间'" class="w105px" />
          <el-date-picker v-model="data.time[1]" align="right" type="date" placeholder="选择终止日期" />
        </div>
        <div class="x mt10px jc">
          <span v-text="'制单人'" class="w105px" />
          <sUser v-model="data.user" @change="change" />
        </div>
        <div class="x mt10px jc">
          <span v-text="'单据类型'" class="w105px" />
          <sItemIO @change="change" />
        </div>
      </div>
      <div class="x zb p10px">
        <el-button
          @click="outPut(tabData)"
          v-text="'导出全部'"
          size="mini"
          type="danger"
          plain
          :disabled="!tabData.length"
        />
        <el-button
          @click="outPut([bill])"
          v-text="'导出当前'"
          size="mini"
          type="success"
          plain
          :disabled="!bill"
        />
      </div>
      <div class="x zb p10px">
        <el-button v-text="'返回列表'" size="mini" type="success" @click="bill=false" />
        <el-button v-text="'开始查找'" size="mini" type="primary" @click="send" />
      </div>
    </div>
    <div class="ybl hf">
      <h2 v-text="'查询列表'" class="m10px" style="align-self:center" />
      <div class="ybl">
        <div class="ybl">
          <div v-if="bill" class="ybl">
            <bill_ :data="bill" :fun="0" @change="change" />
          </div>
          <div v-else class="ybl p10px">
            <el-table :data="tabData2" border stripe highlight-current-row height="130" class="fg1">
              <el-table-column
                fixed
                type="index"
                label="行号"
                width="50"
                show-overflow-tooltip
                header-align="center"
                align="center"
              />
              <el-table-column
                prop="id"
                label="id"
                width="50"
                show-overflow-tooltip
                header-align="center"
                align="center"
              />
              <el-table-column
                prop="CreateTime"
                :formatter="fTime"
                label="单据时间"
                width="180"
                show-overflow-tooltip
                header-align="center"
                align="center"
              />
              <el-table-column
                prop="user"
                label="制单人"
                width="80"
                show-overflow-tooltip
                header-align="center"
                align="center"
              />
              <el-table-column
                prop="type"
                :formatter="fType"
                label="单据类型"
                width="100"
                show-overflow-tooltip
                header-align="center"
                align="center"
              />
              <el-table-column
                prop="type"
                label="操作"
                width="101"
                show-overflow-tooltip
                header-align="center"
                align="center"
              >
                <template slot-scope="scope">
                  <el-button @click="info(scope.row)" v-text="'查看详情'" type="success" size="mini" />
                </template>
              </el-table-column>
              <el-table-column
                prop="other"
                label="备注"
                show-overflow-tooltip
                header-align="center"
                align="center"
              />
            </el-table>
            <fy :value="tabData" @change="tabData2=$event" />
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import sUser from "../components/select/sUser";
import sItemIO from "../components/select/sItemIO";
import bill_ from "./bill/bill";
import fy from "../components/fy";

// import FileSaver from "file-saver";
import XLSX from "xlsx";

export default {
  components: { sUser, sItemIO, bill_, fy },
  // props: [],
  data() {
    return {
      data: {
        time: [null, null]
      },
      tabData: [],
      tabData2: [],
      type: ["其他单据", "入库单", "出库单", "库存调整单"],
      bill: false,
      labels: ["查看单据", "入库单", "出库单", "库存调整单"]
    };
  },
  // computed() {return{}},
  created() {},
  methods: {
    send() {
      this.bill = false;
      let data = this.$cp(this.data);
      if (!(this.data.time[0] || this.data.time[1])) {
        data = this.$del(data, "time");
      } else {
        if (data.time[0]) {
          data.time[0] = parseInt(new Date(data.time[0]) / 1000);
        } else {
          data.time[0] = 0;
        }
        if (data.time[1]) {
          data.time[1] = parseInt(new Date(data.time[1]) / 1000);
        } else {
          data.time[1] = parseInt(new Date() / 1000);
        }
        data.time[1] += 86400;
        if (data.time[1] < data.time[0]) {
          this.$message.error("终止时间 必须 大于起始时间");
        }
      }
      data.token = sessionStorage.token;
      data.table = "itemIO";
      data = { cmd: 0, val: data };
      this.$post(
        data,
        res => {
          // console.log(this.$cp(res.result));
          if (res.result) this.tabData = res.result;
          else {
            this.$message.error("当前条件下数据为空");
            this.tabData = [];
            console.log(this.$cp(res));
          }
        },
        false,
        true
      );
    },
    info(a) {
      this.bill = a;
    },
    selectUser(a) {
      this.data.user = a;
    },
    change(a, b, c) {
      switch (a) {
        case "user":
          this.data.user = b;
          break;
        case "itemIO":
          this.data.type = b;
          break;
        default:
          break;
      }
    },
    fTime(a, b) {
      const ret = new Date(a[b.property] * 1000);
      return ret.toLocaleString();
    },
    fType(a, b) {
      return this.type[a[b.property]]; // a[b.property]
    },
    outPut(a, FileName = "导出单据.xlsx") {
      let SheetNames = [];
      let data = {};
      let wscols = [
        { wch: 16 },
        { wch: 32 },
        { wch: 16 },
        { wch: 16 },
        { wch: 16 },
        { wch: 16 },
        { wch: 16 },
        { wch: 16 },
        { wch: 16 },
        { wch: 32 }
      ]; //设置字段宽度

      a.map(a => {
        let ret = a.info.map(b => {
          return [
            b.id.toString(),
            b.uid,
            b.name,
            b.model,
            b.sum.toString(),
            this.$gd.process.getItem({ id: b.process }).name,
            this.$gd.depository.getItem({ id: b.depository }).name,
            b.projectName,
            this.$gd.project.getItem({ id: b.project }).name,
            b.remarks
          ];
        });
        ret.unshift(
          [
            "单据id:" + a.id.toString(),
            "制单时间:" + new Date(a.CreateTime * 1000).toLocaleString(),
            "单据类型:" + this.labels[a.type],
            "状态:" + (a.state ? "正常" : "销毁"),
            "制单人:" + a.user
          ],
          [],
          [],
          [
            "item",
            "物料号",
            "物料名称",
            "型号",
            "数量",
            "工序",
            "仓库",
            "项目",
            "列次",
            "备注"
          ]
        );
        let name = "单据_" + a.id;
        SheetNames.push(name);
        data[name] = XLSX.utils.aoa_to_sheet(ret);
        data[name]["!cols"] = wscols;
      });
      let file = XLSX.utils.book_new();
      file["SheetNames"] = SheetNames;
      file["Sheets"] = data;
      XLSX.writeFile(file, FileName);
    }
  }
};
</script>
<style lang="less" scoped>
</style>
